﻿<template>
	<div class="content55">
		<header class="header">
			<div @click="$router.go(-1)" class="left iconfont icon-left"></div>
			<div class="title">Contrato de financiación</div>
		</header>
		<div class="box" id="hetong" v-if="show">
			<!-- <h1 style="font-size: 18px; text-align: center;">Banco Atlántico (contrato de préstamo)</h1>
			<div style="margin: 30px 0; border-bottom: 1px dashed #333;">&nbsp;</div>
			<div style="font-size: 14px;">
				<span style="font-weight: 600;">Pago diario: </span>
				<span class="r-applicationTime" v-text="data.date" v-if="data.date"></span>
			</div>
			<div style="font-size: 14px;"><span style="font-weight: 600;">Código: </span>{{ data.order }}</div>
			<div style="font-size: 14px;">
				<span style="font-weight: 600;">Nombre del solicitante: </span>
				<span v-text="data.personal.name" v-if="data.personal"></span>
			</div>
			<div style="font-size: 14px;">
				<span style="font-weight: 600;">Residencia: </span>
				<span v-text="data.personal.address" v-if="data.personal"></span>
			</div>
			<div style="font-size: 14px;">
				<span style="font-weight: 600;">Número de teléfono: </span>
				<span v-text="data.mobile" v-if="data.mobile"></span>
			</div>
			<div style="font-size: 14px;">
				<span style="font-weight: 600;">Nombre del Banco: </span>
				<span v-text="data.bank.bank_name" v-if="data.bank"></span>
			</div>
			<div style="font-size: 14px;">
				<span style="font-weight: 600;">Número de tarjeta bancaria: </span>
				<span v-text="data.bank.bank_number" v-if="data.bank"></span>
			</div>
			<div style="font-size: 14px;">&nbsp;</div>
			<div style="border: 1px dashed #333;">
				<div style="line-height: 50px; font-size: 18px; font-weight: 600; text-align: center;">Contenido del contrato</div>
				<div style="background: #000; color: #fff; font-weight: 600; padding: 10px;">Tema: Banco Atlántico
Solicitud mensual de préstamo en efectivo<span style="flex: 1; padding: 5px 10px; position: relative;"><span class="r-period">{{
						$route.query.months }}</span></span></div>
				<div style="padding: 10px;">Gracias por elegir Banco Atlántico como una empresa de préstamos personales no garantizada.
Notificar la aprobación del préstamo de acuerdo con las condiciones anteriores y de acuerdo con los siguientes principios:</div>
			</div>
			<ul style="padding: 0; border: 1px solid #333; margin-top: 20px;">
				<li style="display: flex; margin-bottom: 1px;"><span
						style="flex: 1; padding: 5px 10px; position: relative; color: #fff; background: #333;">Tipo de préstamo</span><span
						style="flex: 1; padding: 5px 10px; position: relative;">Pago a plazos<br><em
							style="position: absolute; height: 1px; background: #333; width: 100%; left: 0; bottom: -1px;">&nbsp;</em></span>
				</li>
				<li style="display: flex; margin-bottom: 1px;"><span
						style="flex: 1; padding: 5px 10px; position: relative; color: #fff; background: #333;">Período de préstamo</span><span
						style="flex: 1; padding: 5px 10px; position: relative;"><span class="r-period">{{ months
							}}</span> Mes<em
							style="position: absolute; height: 1px; background: #333; width: 100%; left: 0; bottom: -1px;">&nbsp;</em></span>
				</li>
				<li style="display: flex; margin-bottom: 1px;"><span
						style="flex: 1; padding: 5px 10px; position: relative; color: #fff; background: #333;">Importe del préstamo</span><span
						style="flex: 1; padding: 5px 10px; position: relative;"><span class="r-currency">¥</span> <span
							class="r-loanAmount">{{ amount }}</span><em
							style="position: absolute; height: 1px; background: #333; width: 100%; left: 0; bottom: -1px;">&nbsp;</em></span>
				</li>
				<li style="display: flex; margin-bottom: 1px;"><span
						style="flex: 1; padding: 5px 10px; position: relative; color: #fff; background: #333;">Tipo de préstamo</span><span
						style="flex: 1; padding: 5px 10px; position: relative;">Tipo de interés fijo<br><em
							style="position: absolute; height: 1px; background: #333; width: 100%; left: 0; bottom: -1px;">&nbsp;</em></span>
				</li>
				<li style="display: flex; margin-bottom: 1px;"><span
						style="flex: 1; padding: 5px 10px; position: relative; color: #fff; background: #333;">Tasa de interés</span><span
						style="flex: 1; padding: 5px 10px; position: relative;"><span class="r-loanRate">{{
							rate }}</span>%
						/Un mes<em
							style="position: absolute; height: 1px; background: #333; width: 100%; left: 0; bottom: -1px;">&nbsp;</em></span>
				</li>
				<li style="display: flex; margin-bottom: 1px;"><span
						style="flex: 1; padding: 5px 10px; position: relative; color: #fff; background: #333;">Validez del aviso de sanción disciplinaria</span><span
						style="flex: 1; padding: 5px 10px; position: relative;">Válido durante un mes a partir de la fecha de emisión del aviso disciplinario<br><em
							style="position: absolute; height: 1px; background: #333; width: 100%; left: 0; bottom: -1px;">&nbsp;</em></span>
				</li>
				<li style="display: flex; margin-bottom: 0;"><span
						style="flex: 1; padding: 5px 10px; position: relative; color: #fff; background: #333;">Tarifas contractuales de préstamos electrónicos, impuestos de timbre (reembolsables)</span><span
						style="flex: 1; padding: 5px 10px; position: relative;">10% USD<br><em
							style="position: absolute; height: 1px; background: #333; width: 100%; left: 0; bottom: -1px;">&nbsp;</em></span>
				</li>
			</ul>
			<ul style="padding: 0; border: 1px solid #333;">
				<li style="display: flex; margin-bottom: 1px;"><span
						style="flex: 1; padding: 5px 10px; position: relative; color: #fff; background: #333;">Todos los impuestos aplicables, comisiones y aranceles vigentes deben pagarse de acuerdo con la ley.</span><span
						style="flex: 1; padding: 5px 10px; position: relative;">Los gastos de procesamiento y los gastos correspondientes se facturarán antes del préstamo.
El importe total de los intereses se paga durante el período de préstamo<br><em
							style="position: absolute; height: 1px; background: #333; width: 100%; left: 0; bottom: -1px;">&nbsp;</em></span>
				</li>
				<li style="display: flex; margin-bottom: 0;"><span
						style="flex: 1; padding: 5px 10px; position: relative; color: #fff; background: #333;">Observación.
Según los términos y condiciones, a partir de la fecha de vencimiento del pago a plazos, el interés del pago diferido se calculará a una tasa mensual del 0,4% (4,8% en un año).</span><span
						style="flex: 1; padding: 5px 10px; position: relative;">Asuntos especiales: su préstamo fue aprobado previamente por Banco Atlántico
En algunos casos, nuestras instituciones financieras cooperativas pueden realizar una inspección especial de su crédito y solicitar tarifas adicionales.<br><em
							style="position: absolute; height: 1px; background: #333; width: 100%; left: 0; bottom: -1px;">&nbsp;</em></span>
				</li>
			</ul>
			<div style="padding: 10px; border: 1px solid #333;"><span
					style="flex: 1; padding: 5px 10px; position: relative;"><span class="r-currency">&nbsp;
						<span v-text="data.personal.name" v-if="data.personal.name"></span>
						<span v-if="data.personal.gender === 1">- sí.</span>
						<span v-if="data.personal.gender === 0">Agrio</span>
						. después de acordar las condiciones anteriores, en la cuenta bancaria salarial designada en el momento de solicitar el préstamo <span class="r-loanAmount">{{ $route.query.amount
							}}</span><span class="r-loanAmount">&nbsp;USD</span></span></span>,
				Pago directo</div>
			<div style="margin-top: 20px;">
				<ol>
					<li>Términos y condiciones del contrato / importe del préstamo</li>
				</ol>
				<p>Como firmante anterior a este contrato (en adelante, "prestatario")</p>
				<p>El prestatario y la empresa (en adelante, el "prestamista") juran cumplir los asuntos y condiciones del presente acuerdo. Los asuntos y condiciones específicas son los siguientes:。</p>
				<p>1)El contrato de crédito de rotación común ("consentimiento") es el consentimiento crediticio de rotación común del prestamista.&nbsp;(「"Proyecto"」)
					Completamente efectivo。&nbsp;En los contratos de crédito y las operaciones de rotación, las Partes en el contrato generalmente deben proporcionar crédito después de la aprobación de la empresa en el contrato y el registro general de crédito de rotación (en adelante, "encargo · consentimiento").&nbsp;（En adelante, se llama "cliente"）。
				</p>
				<p>2)La compañía decide si reconoce o no la línea de crédito. Cuando la compañía apruebe la solicitud de línea de crédito del cliente, la compañía notificará la línea de crédito al cliente por correo, teléfono u otros medios reconocidos.。</p>
			</div>
			<p>2.Formulario de consentimiento y condiciones de préstamo</p>
			<p>1. Los resultados del análisis bancario muestran que la compañía tiene en cuenta los riesgos a la hora de conceder líneas de crédito a los prestatarios.
El prestatario es、&nbsp;Debes estar de acuerdo con la inspección del riesgo de liquidez. Entre el 20% y el 50% de los préstamos de las empresas para elaborar un currículum crediticio de pago a plazos de préstamos personales (a veces diferente según la revisión de la Agencia de investigación crediticia)
Comprobar la capacidad mínima de pago del prestatario。&nbsp;</p>
			<p>2. El prestatario garantiza que el monto del préstamo no se utilizará con fines ilegales sin razón.。</p>
			<p>3.Responsabilidad por rescisión del contrato&nbsp;&nbsp;&nbsp;</p>
			<p>(1)Después de la firma del presente contrato (si no se presenta para discusión, se considerará nulo), las Partes cumplirán todas las condiciones y Asuntos del presente contrato.
Si una de las partes viola las condiciones y Asuntos del contrato, la otra parte tiene derecho a presentar una demanda ante el Tribunal.&ZeroWidthSpace;&ZeroWidthSpace;Sobre la base de que las Partes no tienen objeciones, la parte infractora debe basarse en el monto del préstamo.
Tienes que pagar el 50% de los daños liquidados.。</p>
			<p>(2)El prestatario debe garantizar que el monto del préstamo no se utilice para fines ilegales prohibidos por el Estado.。</p>
			<p>(3)El prestatario debe reembolsar el monto del préstamo dentro del plazo acordado en el contrato. Si el prestatario desea prorrogar el plazo del préstamo, debe solicitarlo al prestamista cinco días antes de que expire el préstamo.
Si el prestatario quiere reembolsar el monto del préstamo antes del plazo, debe presentar la solicitud al prestamista cinco días antes del próximo plazo de reembolso.。</p>
			<p>4.Si el prestatario es aprobado para prestar, algunos clientes calificados con un historial crediticio pobre, el prestamista primero debe confirmar su identidad.
Los prestatarios que no puedan pagar a través de transferencias deben pagar al cliente&nbsp;Debe ponerse en contacto con el servicio para completar el pago por adelantado. El prestatario solo puede confirmar el pago después del primer pago</p>
			<p>5. De acuerdo con las regulaciones del sistema financiero Ecuador, los prestamistas asumen el riesgo del monto del préstamo garantizado al prestatario y deben confirmar la solvencia mínima personal del prestatario calificado. El prestatario debe basarse en el monto del préstamo.&nbsp; &nbsp; 20% A partir de... comenzar
				50% Necesito depositar el dinero en mi cuenta. Treinta minutos después de la aprobación del banco, el Banco enviará la remesa a la cuenta designada en el contrato del prestatario.
Si el prestatario no cumple los términos del contrato después de la firma del contrato, la compañía será considerada un fraude intencional importante y será demandada por un tribunal Ecuador y castigada de acuerdo con la ley.</p>
			<p>6.Si el prestatario no cumple el contrato, el prestatario debe asumir las pérdidas causadas por el prestatario.
Como resultado, el prestatario puede confirmar todos los gastos incurridos, incluidos los gastos de litigio, los gastos de abogado, la devolución de los gastos de abogado y otros gastos que deben pagarse, sobre la base de las pruebas del prestatario.
El prestatario responde al prestamista para leer y entender los documentos del contrato</p>
			<p>7.Si el prestatario no cumple el contrato, el prestatario debe asumir las pérdidas causadas por el prestatario.
Como resultado, el prestatario puede confirmar todos los gastos incurridos, incluidos los gastos de litigio, los gastos de abogado, la devolución de los gastos de abogado y otros gastos que deben pagarse, sobre la base de las pruebas del prestatario.
El prestatario responde al prestamista para leer y entender los documentos del contrato。</p>
			<p>8.Condiciones de garantía: banco suizo, Banco Internacional de Estados Unidos y Post Bank de Banco Atlántico emiten conjuntamente el monto del préstamo.
Durante el período de préstamo, el prestatario debe cumplir y cumplir con todas las condiciones del contrato de pago de intereses durante el período ① y el pago del principal durante el período ③.
Si se violan los puntos anteriores, el prestatario tendrá un mal historial crediticio personal creado por el sistema de crédito bancario.。</p>
			<h2 style="font-size: 15px;">Política de reembolso y cancelación</h2>
			<div style="padding: 10px; border: 1px dashed #333;">Cualquier pago adicional se reembolsará junto con el préstamo controlado.
El servicio no se cancela cuando el importe del préstamo se deposita en la cuenta bancaria</div> -->



			<div v-html="data.aggrement"></div>

			<div style="display: flex; margin-top: 20px;">
				<div style="flex: 1; position: relative; padding-bottom: 20px;">
					<div style="font-size: 16px; font-weight: 600;z-index: 3;position: relative;" >Banco Atlántico</div>
					<div style="font-size: 17px; font-weight: 600; margin-top: 80px; text-align: center;z-index: 3;position: relative;">Firma</div>
					<div
						style="position: absolute; top: 0; left: 0; width: 100%; height: calc(100% - 80px); z-index: 2;">
						<img style="object-fit: contain; width: 70%;" crossorigin="anonymous" :src="esignUrl + data.hetong">
					</div>
				</div>
				<div style="flex: 1; position: relative; padding-bottom: 20px; margin-left: 20px;">
					<div style="font-size: 16px; font-weight: 600;z-index: 3;position: relative;" >Prestatario</div>
					<div
						style="position: absolute; top: 0; left: 0; width: 100%; height: calc(100% - 80px); z-index: 2;">
						<img v-if="data.pic" style="object-fit: contain; width: 70%;" crossorigin="anonymous" :src="esignUrl + data.pic">
					</div>
				</div>
			</div>
		</div>
		<div style="padding: 0 20px;"><button class="topup" @click="save"
				style="width:100%;box-sizing: border-box;">Guardar como imagen</button></div>
	</div>
</template>

<script>
import html2canvas from 'html2canvas';
import AJAX from '@/utils/http';
export default {
	data() {
		return {
			data: {},
			months: '',
			rate: '',
			amount: '',
			show: false,
		};
	},
	created() {
		this.months = this.$route.query.months || '';
		this.rate = this.$route.query.rate || '';
		this.amount = this.$route.query.amount || '';
		this.fetchData();
	},
	computed: {
		esignUrl() {
			const url = new URL(AJAX.defaults.baseURL);
			const origin = url.origin;
			return this.data.hetong ? origin : '';
		},
	},
	methods: {
		save() {
			html2canvas(document.getElementById('hetong')).then(canvas => {
				const url = canvas.toDataURL('image/png');
				const a = document.createElement('a');
				a.href = url;
				a.download = '融資契約.png';
				a.click();
			});
		},
		fetchData() {
			AJAX.post('/index/aggrement', {}).then(e => {
				this.data = e.data;
				this.show = true;
				this.amount = e.data.order_info ? e.data.order_info.money : 0 ;
				this.months = e.data.order_info ? e.data.order_info.month : 0;
				this.rate = e.data.rate;
			});
		},
	}
};
</script>

<style scoped>
.box {
	min-height: 100%;
	padding: 12px;
	background: rgb(255, 255, 255);
	font-size: 14px;
}
</style>